Passed
Push — master ( 5f67fe...8bce0b )
by Jesús
02:16
created

theme.ts ➔ initTheme   A

Complexity

Conditions 1

Size

Total Lines 8
Code Lines 8

Duplication

Lines 0
Ratio 0 %

Importance

Changes 0
Metric Value
cc 1
eloc 8
dl 0
loc 8
rs 10
c 0
b 0
f 0
1
import { toggleTheme as domainToggleTheme, getThemeToggleLabel, getAriaPressed } from '../domain/themeLogic';
2
3
export function initTheme(): void {
4
  const savedTheme = localStorage.getItem('theme');
5
  const theme = savedTheme || getOSTheme();
6
  
7
  setDocumentTheme(theme);
8
  updateThemeButtonState(theme);
9
  setupThemeListener(savedTheme);
10
}
11
12
function getOSTheme(): 'light' | 'dark' {
13
  if (typeof window !== 'undefined' && window.matchMedia) {
14
    return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
15
  }
16
  return 'dark';
17
}
18
19
function setDocumentTheme(theme: string): void {
20
  document.documentElement.setAttribute('data-theme', theme);
21
}
22
23
function setupThemeListener(savedTheme: string | null): void {
24
  if (!savedTheme && typeof window !== 'undefined' && window.matchMedia) {
25
    const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
26
    mediaQuery.addEventListener('change', (e) => {
27
      if (!localStorage.getItem('theme')) {
28
        const newTheme = e.matches ? 'dark' : 'light';
29
        setDocumentTheme(newTheme);
30
        updateThemeButtonState(newTheme);
31
      }
32
    });
33
  }
34
}
35
36
export function toggleTheme(): void {
37
  const currentTheme = document.documentElement.getAttribute('data-theme');
38
  const newTheme = domainToggleTheme(currentTheme);
39
  
40
  setDocumentTheme(newTheme);
41
  localStorage.setItem('theme', newTheme);
42
  updateThemeButtonState(newTheme);
43
}
44
45
export function updateThemeButtonState(theme: string): void {
46
  const themeButton = document.getElementById('theme-toggle');
47
  if (themeButton) {
48
    themeButton.setAttribute('aria-pressed', getAriaPressed(theme));
49
    themeButton.setAttribute('aria-label', getThemeToggleLabel(theme));
50
  }
51
}
52